<template>
  <a-config-provider
      :theme="{ token: { colorPrimary: data.colorPrimary } , algorithm: dark?theme.darkAlgorithm:theme.defaultAlgorithm}"
      :wave="{disabled:true}"
      :getPopupContainer="getPopupContainer"
      :locale="zhCN">
    <a-app>
      <router-view v-slot="{ Component }">
        <component :is="Component" v-if="Component"/>
      </router-view>
    </a-app>

  </a-config-provider>
</template>

<script setup lang="ts">
import zhCN from 'ant-design-vue/es/locale/zh_CN';
import {onMounted, ref} from "vue";
import router from "~/router";
import {storeToRefs} from "pinia";
import {useUserStore} from "~/store/modulers/user";
import {theme} from "ant-design-vue";
import {useSettingStore} from "~/store/modulers/setting";
import {useMenuStore} from "~/store/modulers/menu";
import {CommonApi} from "~/api/system/common.api";

const defaultData = {
  colorPrimary: '#1677ff',
};

const api = new CommonApi();
const data = ref(defaultData);
const userStore = useUserStore();
const {token} = storeToRefs(userStore);
const settingStore = useSettingStore();
const {dark} = storeToRefs(settingStore);
const menuStore = useMenuStore();

function getPopupContainer(el: any, dialogContext: any) {
  if (dialogContext) {
    return dialogContext.getDialogWrap();
  } else {
    return document.body;
  }
}

async function onLoadHandler() {
  if (!token?.value) {
    await router.push("/login");
  } else {
    const menu = await api.getUserMenu();
    if (menu.ok) {
      menuStore.setMenu(menu.data);
    }
  }
}

onMounted(() => {
  window.addEventListener("load", async () => {
    await onLoadHandler();
  });
});

</script>

<style scoped>

</style>
